浏览器渲染一帧都做了什么
页面的内容都是一帧一帧绘制出来的，浏览器刷新率代表浏览器一秒绘制多少帧。原则上说 1s 内绘制的帧数也多，画面表现就也细腻。目前浏览器大多是 60Hz（60 帧/s），每一帧耗时也就是在 16.6ms 左右(1000ms / 60hz = 16.6)，超出这个时间，页面的渲染就会出现卡顿现象，影响用户体验。
- 接受输入事件
- 执行事件回调
- 开始一帧
- 执行
RequestAnimationFrame - 页面布局，样式计算
- 绘制渲染
- 执行
RequestIdelCallback
第七步的 RIC 事件不是每一帧结束都会执行，只有在一帧的 16.6ms 中做完了前面 6 件事儿且还有剩余时间，才会执行。如果一帧执行结束后还有时间执行 RIC 事件，那么下一帧需要在事件执行结束才能继续渲染，所以 RIC 执行不要超过 30ms，如果长时间不将控制权交还给浏览器，会影响下一帧的渲染，导致页面出现卡顿和事件响应不及时。